import React, { Component} from 'react';
import { withRouter } from 'react-router-dom';
import '../../scss/Mycenter.scss'
import logo from "./头像.jpg";
import { CreditCardFilled ,RightOutlined, CarryOutFilled , ReadFilled , LayoutFilled , ShoppingCartOutlined} from '@ant-design/icons';
import { connect } from 'react-redux';


class Mycenter extends Component {

    render() {
        return (
            <div className='mycenter'>
                <div className="top">
                    <div className="myimg">
                        <div className='img'><img src={ logo } alt="" /></div>
                        <span>顺走瞎子的导盲犬</span>
                    </div>
                </div>

                <div className="collect">
                    <div className="center">
                        <div className="cact" onClick={ this.gogoPart }>
                            <div> { this.props.call.length } </div>
                            <div>收藏</div>
                        </div>
                        <div className="cact">
                            <div>0</div>
                            <div>积分</div>
                        </div>
                        <div className="cact">
                            <div>0</div>
                            <div>优惠券</div>
                        </div>
                    </div>
                </div>

                <div className="myorder">
                    <div className="center">

                        <div className="top_center">
                            <div className="top_top">
                                <div className='order'>我的订单</div>
                                <span>查看全部订单</span>
                            </div>
                        </div>

                        <div className="bottom">
                            <div className="cact">
                                <div className='icon'><CreditCardFilled /></div>
                                <div>待付款</div>
                            </div>
                            <div className="cact">
                                <div className='icon'><LayoutFilled /></div>
                                <div>代发货</div>
                            </div>
                            <div className="cact">
                                <div className='icon'><CarryOutFilled /></div>
                                <div>已发货</div>
                            </div>
                            <div className="cact">
                                <div className='icon'><ReadFilled /></div>
                                <div>待评价</div>
                            </div>
                        </div>

                    </div>
                </div>

                <div className="select">
                    <div className="c">
                        <div className='vio'>会员中心</div>
                        <span><RightOutlined /></span>
                    </div>
                </div>

                <div className="main">
                    <div className="center">
                    <div className="c">
                        <div className='vio'>领券中心</div>
                        <span><RightOutlined /></span>
                    </div>
                    <div className="c">
                        <div className='vio'>我的评价</div>
                        <span><RightOutlined /></span>
                    </div>
                    <div className="c">
                        <div className='vio'>收货地址</div>
                        <span><RightOutlined /></span>
                    </div>
                    <div className="c">
                        <div className='vio'>我的客服</div>
                        <span><RightOutlined /></span>
                    </div>
                    </div>
                </div>
            </div>
        );
    }
    gogoPart = () => {
        this.props.history.push({ pathname:'/collect' });
    }

    componentDidMount() {
       
    }
   
}
var newMycenter = connect(
    state => {
        return {
            call:state.call
        }
    },
    dispatch => {
        return {
           
        }
    }

)( Mycenter )
export default withRouter(newMycenter);